﻿@using Abp.Application.Services.Dto
@using Abp.Authorization.Users
@using Abp.Configuration.Startup
@using Abp.Extensions
@using Abp.Timing;
@using MyCompanyName.AbpZeroTemplate.Authorization.Users
@using MyCompanyName.AbpZeroTemplate.Web.Areas.AppAreaName.Models.Common.Modals
@using MyCompanyName.AbpZeroTemplate.Web.Areas.AppAreaName.Models.Profile
@model MySettingsViewModel
@inject IMultiTenancyConfig MultiTenancyConfig

@await Html.PartialAsync("~/Areas/AppAreaName/Views/Common/Modals/_ModalHeader.cshtml", new ModalHeaderViewModel(L("MySettings")))

<div class="modal-body">
    <ul class="nav nav-tabs" role="tablist">
        <li class="nav-item">
            <a href="#MySettingsTab" class="nav-link active" data-toggle="tab" role="tab">
                @L("Profile")
            </a>
        </li>
        @if (!MultiTenancyConfig.IsEnabled || (await SettingManager.GetSettingValueAsync("Abp.Zero.UserManagement.TwoFactorLogin.IsEnabled")).To<bool>())
        {
            <li class="nav-item">
                <a href="#TwoFactorLoginTab" data-toggle="tab" role="tab" class="nav-link">
                    @L("TwoFactorLogin")
                </a>
            </li>
        }
    </ul>
    <div class="tab-content">
        <div class="tab-pane pt-5 active" id="MySettingsTab">

            <form name="MySettingsModalForm" class="form">
                <div class="form-group">
                    <label for="Name">@L("FirstName")</label>
                    <input id="Name" class="form-control edited" type="text" name="Name" value="@Model.Name" required maxlength="@AbpUserBase.MaxNameLength">
                </div>

                <div class="form-group">
                    <label for="Surname">@L("Surname")</label>
                    <input id="Surname" type="text" name="Surname" class="form-control" value="@Model.Surname" required maxlength="@AbpUserBase.MaxSurnameLength">
                </div>

                <div class="form-group">
                    <label for="EmailAddress">@L("EmailAddress")</label>
                    <input id="EmailAddress" type="email" name="EmailAddress" class="form-control" value="@Model.EmailAddress" required maxlength="@AbpUserBase.MaxEmailAddressLength">
                </div>

                @if (Model.SmsVerificationEnabled)
                {
                    <div class="form-group">
                        <label>@L("PhoneNumber")</label>
                        <div class="input-group">
                            <input id="PhoneNumber" type="text" name="PhoneNumber" class="form-control" value="@Model.PhoneNumber" maxlength="@UserConsts.MaxPhoneNumberLength">
                            <input type="hidden" id="savedPhoneNumber" value="@Model.PhoneNumber"/>
                            <input type="hidden" id="isPhoneNumberConfirmed" value="@Model.IsPhoneNumberConfirmed"/>

                            <span id="SpanSmsVerificationUnverified" class="input-group-btn" data-original-title="@L("YourPhoneNumberIsNotVerified")">
                                <button id="btnSmsVerification" class="btn btn-primary" type="button" @(Model.IsPhoneNumberConfirmed ? "disabled" : "")>
                                    <i class="la la-warning"></i> @L("Verify")
                                </button>
                            </span>
                            <div class="input-group-append" id="SpanSmsVerificationVerified" style="@(Model.IsPhoneNumberConfirmed ? "" : "display: none;")">
                                <span class="input-group-text tooltips" data-original-title="@L("YourPhoneNumberIsVerified")">
                                    <i class="la la-check text-success" aria-label="@L("Verified")"></i>
                                </span>
                            </div>
                        </div>
                    </div>
                }

                <div class="form-group">
                    <label for="UserName">@L("UserName")</label>
                    <input id="UserName" type="text" @Html.Raw(!Model.CanChangeUserName ? "disabled=\"disabled\"" : "") class="form-control edited" value="@Model.UserName" name="UserName" required maxlength="@AbpUserBase.MaxUserNameLength">
                    @if (!Model.CanChangeUserName)
                    {
                        <span class="form-text text-muted">@L("CanNotChangeAdminUserName")</span>
                    }
                </div>
                @if (Clock.SupportsMultipleTimezone)
                {
                    <div class="form-group">
                        <label for="Timezone">@L("Timezone")</label>
                        @Html.DropDownList("Timezone", Model.TimezoneItems.Select(i => i.ToSelectListItem()), new {@class = "form-control edited", id = "Timezone"})
                    </div>
                }
            </form>
        </div>
        @if (!MultiTenancyConfig.IsEnabled || (await SettingManager.GetSettingValueAsync("Abp.Zero.UserManagement.TwoFactorLogin.IsEnabled")).To<bool>())
        {
            <div class="tab-pane pt-5" id="TwoFactorLoginTab">
                <div>
                    <h4>
                        Google Authenticator
                    </h4>

                    <div class="google-authenticator-enable" style="@(!Model.IsGoogleAuthenticatorEnabled ? "display:none" : "")">
                        <div>
                            @L("ScanQrCodeWithYourMobileApp")
                        </div>
                        <div class="text-center">
                            <img src="@Model.QrCodeSetupImageUrl"/>
                        </div>
                        <small>
                            @L("GoogleAuthenticatorReferrerLink"): <a href="https://support.google.com/accounts/answer/1066447" target="_blank" rel="noopener noreferrer">Google Authenticator</a>
                        </small>
                    </div>
                    <div class="google-authenticator-disable" style="@(Model.IsGoogleAuthenticatorEnabled ? "display:none" : "")">
                        <button type="button" class="btn btn-success" id="btnEnableGoogleAuthenticator">@L("Enable")</button>
                    </div>

                    <div class="google-authenticator-enable" style="@(Model.IsGoogleAuthenticatorEnabled ? "" : "display:none")">
                        <button type="button" class="btn btn-danger" id="btnDisableGoogleAuthenticator">@L("Disable")</button>
                    </div>
                </div>
            </div>
        }
    </div>
</div>
@await Html.PartialAsync("~/Areas/AppAreaName/Views/Common/Modals/_ModalFooterWithSaveAndCancel.cshtml")
